{% block sw_single_select_option %}
<!-- eslint-disable-next-line vuejs-accessibility/click-events-have-key-events vuejs-accessibility/mouse-events-have-key-events, vuejs-accessibility/no-static-element-interactions -->
<li
    class="sw-select-option"
    :class="componentClasses"
    @mouseenter="onMouseEnter($event)"
    @click.stop="onClicked($event)"
>
    {% block sw_single_select_option_item_text_holder %}
    <span class="sw-select-option__result-item-text">
        {% block sw_single_select_option_item_text %}
        <slot></slot>
        {% endblock %}
    </span>
    {% endblock %}

    {% block sw_single_select_option_item_icon_transition %}
    <transition name="sw-select-appear">
        {% block sw_single_select_option_item_icon %}
        <mt-icon
            v-if="isInSelections(item) && !selected || selected"
            name="regular-checkmark-xs"
            size="16px"
        />
        {% endblock %}
    </transition>
    {% endblock %}
</li>
{% endblock %}
